<template>
    <el-tabs v-model="activeName" class="demo-tabs" @tab-change="change">
        <el-tab-pane label="周" name="week">
            <WeekConsecutive v-if="activeName === 'week'"></WeekConsecutive>
        </el-tab-pane>
        <el-tab-pane label="日" name="daily">
            <DailyConsecutive v-if="activeName === 'daily'"></DailyConsecutive>
        </el-tab-pane>
    </el-tabs>
</template>

<script setup>
import { ref, reactive } from 'vue'
import DailyConsecutive from '../components/DailyConsecutive.vue'
import WeekConsecutive from '../components/WeekConsecutive.vue'
import { useRouteQuery } from '../utils/useRoute'

const activeNameKey = "StockConsecutiveActiveName"
const activeName = ref(sessionStorage.getItem(activeNameKey) || 'week')

const state = reactive({
    stock: '',
})

state.stock = useRouteQuery('stock')
const change = (tabName) => {
    sessionStorage.setItem(activeNameKey, tabName)
}
</script>